<template>
  <view class=" footer">
                 <view class="iconfont shouye" >
					 <view class="shou" @tap="goto()">
						  <i class="tu">&#xe607;</i>
						 <view >首页</view>
					 </view>
				 </view>
                 <view class="iconfont shop" @tap="gotoshop()">
					<view class="shang" >
						 <i class="tu"> &#xe6a2;</i>
						 <view >商品</view> 
					 </view>
					</view>
                 <view class="iconfont  order" @tap="gotoorder()">
					 <view class="ding" >
						  <i class="tu">&#xe653;</i>
						 <view >订单</view>
					 </view>
					 </view>
				 <view class="iconfont  activity" @tap="gotoacivity()">
					 <view class="huo">
						  <i class="tu">&#xe616;</i>
						 <view >活动</view>
					 </view>
					 </view>
				 <view class="iconfont  my"  @tap="gotomy()">
					 <view class="me">
						 <i class="tu"> &#xe60b;</i>
						 <view>我的</view>
					 </view>
					
					</view>
                  
            </view>
			
</template>

<script>
	
	
	export default{
		
		data(){
			
		},
		methods:{
			gotoshop(){
				uni.navigateTo({
					url:'../../pages/shop/shop',
				})
			},
			goto(){
				uni.navigateTo({
				 url:'../../pages/index/index', 
					})
			},
			gotoorder(){
				uni.navigateTo({
					url:'../../pages/order/order',
				})
			},
			gotoacivity(){
				uni.navigateTo({
					url:'../../pages/activity/activity',
				})
			},
			gotomy(){
				uni.navigateTo({
					url:'../../pages/my/my'
				})
			}
			
			
		
		}
		
		
		
	}
	
</script>
<style>
	.footer{
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0px;
		width: 100%;
		height: 45px;
		background: #FFFFFF;
		
	}
	.shouye{
		float: left;
		width: 150upx;
		height: 90upx;
		color: #999999 ;
		position: relative;
	}
	.shouye:hover{
		color: #3B9CDB ;
	}
	.shou{
		width:90upx ;
		height: 90upx;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: 0 auto;
	}
	.shop{
		float: left;
		width: 150upx;
		height: 90upx;
		color: #999999 ;
		position: relative;
	}
	.shop:hover{
		color: #3B9CDB ;
	}
	.shang{
		width:84upx ;
		height: 90upx;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: 0 auto;
	}
	.order{
		float: left;
		width: 150upx;
		height: 90upx;
		color: #999999 ;
	}
	.order:hover{
		color:  #3B9CDB;
		
	}
	.ding{
		width: 84upx ;
		height: 90upx;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: 0 auto;
	}
	.activity{
		float: left;
		width: 150upx;
		height: 90upx;
		color: #999999 ;
		position: relative;
	}
	.activity:hover{
		color:  #3B9CDB;
	}
	.huo{
		width: 84upx ;
		height: 90upx;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: 0 auto;
	}
	.my{
		float: left;
		width: 150upx;
		height: 90upx;
		color: #999999 ;
		position: relative;
	}
	.my:hover{
		color:  #3B9CDB;
	}
	.me{
		width: 84upx ;
		height: 90upx;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: 0 auto;
	}
	.tu{
		text-align: center;
	}
	
	
	
</style>
